<template>
  <view class="release">
    <up-tabs
      :list="honorReleaseTabs"
      :lineWidth="tabLineWidth"
      :lineHeight="tabLineHeight"
      lineColor="#00b588"
      @click="handleTabClick"
      :activeStyle="{
        color: '#303133',
        fontWeight: 'bold',
        transform: 'scale(1.05)',
      }"
    />
    <view class="list">
      <template v-for="(item, index) in curReleaseList" :key="item.id">
        <release-item
          :release-detail="item"
          :tag-name="curTabName"
          @handle-item-click-emit="handleReleaseItemClick(index)"
        />
      </template>
    </view>
  </view>
</template>
<script setup>
import { computed, inject, reactive, ref } from "vue";
import { getHonorPublishListDataAPi } from "@/api/upLoading/release";
import { onLoad } from "@dcloudio/uni-app";
import releaseItem from "@/package_todo/pages/todo/components/release-item.vue";
import { px2Rpx, rpx2px } from "@/utils/utils";

let imgUrl = import.meta.env.VITE_APP_IMGURL;
const packageTodoPath = inject("packageTodoPath");

/* tabs部分 start */
// 当前tab
const curTabs = ref(0);
const tabLineWidth = computed(() => rpx2px(112));
const tabLineHeight = computed(() => rpx2px(11));
const honorReleaseTabs = reactive([
  {
    name: "政策",
    value: 0,
  },
  {
    name: "资讯",
    value: 1,
  },
  {
    name: "公告",
    value: 2,
  },
]);
/**
 * 监听tab点击事件
 * @param val
 */
const handleTabClick = (val) => {
  curTabs.value = val.value;
  getHonorPublishListData();
};
const curTabName = computed(
  () => honorReleaseTabs.find((item) => item.value === curTabs.value)?.name
);
/* tabs部分 end */

/* 发布列表部分 start*/
// 当前列表数据
const curReleaseList = ref([]);

/**
 * 获取列表数据
 * @returns {Promise<void>}
 */
const getHonorPublishListData = async () => {
  const params = {
    type: curTabs.value,
  };
  const res = await getHonorPublishListDataAPi(params);
  const { code, data } = res;
  if (code === 200) {
    curReleaseList.value = data;
  }
};

/**
 * 监听发布item点击事件
 */
const handleReleaseItemClick = (index) => {
  uni.navigateTo({
    url: `${packageTodoPath}/releaseDetails?type=${curTabs.value}&idx=${index}`,
  });
};
/* 发布列表部分 end*/

onLoad(() => {
  getHonorPublishListData();
});
</script>
<style lang="less" scoped>
/* #ifdef MP-WEIXIN */
.release {
  :deep(.u-tabs) {
    background-color: #ffffff;
    .u-tabs__wrapper {
      .u-tabs__wrapper__scroll-view-wrapper {
        .u-tabs__wrapper__scroll-view {
          .u-tabs__wrapper__nav {
            .u-tabs__wrapper__nav__item {
              flex: 1;
            }
            .u-tabs__wrapper__nav__line {
              width: 112rpx !important;
              height: 11rpx !important;
            }
          }
        }
      }
    }
  }
}
/* #endif */
.u-tabs {
  background-color: #ffffff;

  :deep(.u-tabs__wrapper__nav__item) {
    flex: 1;
  }
}

.list {
  padding: 70rpx 28rpx 0 57rpx;
  background-color: #ffffff;

  .release-item {
    &:last-child {
      border-bottom: none;
    }
  }
}
</style>
